<!-- webView HTML -->

<html>
<head>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.css" type="text/css" />
	<script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js" type="text/javascript"></script>
	
	<link rel="stylesheet" href="leafletPlugins/leaflet-label/leaflet.label.css" type="text/css" />
	<script src="leafletPlugins/leaflet-label/leaflet.label.js" type="text/javascript"></script>
	<link rel="stylesheet" href="leafletPlugins/leaflet-sidebar/L.Control.Sidebar.css" type="text/css" />
	<script src="leafletPlugins/leaflet-sidebar/L.Control.Sidebar.js" type="text/javascript"></script>
	
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
	
	<!-- MAP SPECIFIC JS File -->
	<script src="maps/altis_hd/settings.js" type="text/javascript"></script>

	<script type="text/javascript">
	
		// jquery settings.
		$.ajaxSetup({
			cache: true
		});
	
		// Global variables...naughty naughty!
		var currentIndex= 0;
		var intervalTimer;
		var currentUnitsLayer = new L.layerGroup();
		var contactReportsLayer= new L.layerGroup();
		var priorUnitPos= new Object();
		var highlightedUnit= "";		// Contains the name of the unit we're tracking..if we've used the side menu.
        var missionName= "";            // Directory name that contains the mission.
	
	</script>

	
</head>
<body>
	<div id="map" style="width: 100%; height: 100%"></div>
	<div class="leaflet-container" id="coords" style="z-index: 100; bottom:0px; left: 0px; position: absolute;"></div>
	<div class="leaflet-container" id="navigate" style="z-index: 100; bottom:15px; left: 0px; position: absolute;">
	<input type="button" value="Step Forward" onclick="javascript:currentIndex++;loadAARSequence(currentIndex);">
	<input type="button" value="Step Back" onclick="javascript:currentIndex--;loadAARSequence(currentIndex);">
	<input type="button" value="Play" onclick="setupPlay();">
	<input type="button" value="Pause" onclick="setupPause();">
	<input type="button" value="Reset" onclick="setupReset();">
		<div id="currentPos"></div>
	</div>

	<div id="sidebar">

	</div>

   <script>
		// Don't let the Document Ready run until we're ready for it.  We'll allow once the tiles are loaded.
		$.holdReady( true );
   
		// Mass AAR Stuff.
	
		//map
        var map = L.map('map', {
			minZoom: 0,
			maxZoom: mapMaxZoom,		
			crs: L.CRS.Simple,
		});
		
		// Start in the centre of the map...presumably zoom level 3's always available.
		map.setView(map.unproject([mapXMax/ 2, mapYMax/ 2], map.getMaxZoom()), 3);
		
		//var southWest = map.unproject([0, mapYMax], map.getMaxZoom());
		//var northEast = map.unproject([mapXMax, 0], map.getMaxZoom());   // Was 2048 for min???
		//map.setMaxBounds(new L.LatLngBounds(southWest, northEast));
	
        // **** needs to be dynamic.
        var tileLayers= L.tileLayer('maps/'+ mapName+ '/tiles/{z}/{x}/{y}.png', {
            attribution: 'Bohemia Interactive Studios, marty [CTB], Axyl [CTB], slydog [CTB]',
            tms: true,
			noWrap: true
        }).addTo(map);
		
		// This gets called every time new tiles are loaded, but the first time
		// We want all the tiles before we go and stick the AAR stuff on top.
		tileLayers.on('load', function(e) {
				$.holdReady( false );
		});
		
		// sidebar.
		var sidebar= L.control.sidebar('sidebar', {closeButton: true, position: 'left'});
		map.addControl(sidebar);
		// Make it show...
		setTimeout(function(){sidebar.show();}, 500);
             
		// cities, towns, landmarks, airfields, military, bays, infrastructure, 
		
		// define icons
		
		// **BIS ICONS**
		
		// unit icons
		
		var bisuniticon = L.Icon.extend({
			options: {
				//iconSize: [48, 48],
				iconSize: [32, 32],
				//iconAnchor: [24, 24],
				iconAnchor: [16, 16],
				labelAnchor: [8, 0]
			}
		});	
		// blue units
		var b_air = new bisuniticon({iconUrl: 'icons/bisicons/b_air.png'}),
			b_armor = new bisuniticon({iconUrl: 'icons/bisicons/b_armor.png'}),
			b_art = new bisuniticon({iconUrl: 'icons/bisicons/b_art.png'}),
			b_hq = new bisuniticon({iconUrl: 'icons/bisicons/b_hq.png'}),
			b_iconman_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconman_ca.png'}),
			b_iconmanat_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanat_ca.png'}),
			b_iconmanengineer_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanengineer_ca.png'}),
			b_iconmanexplosive_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanexplosive_ca.png'}),
			b_iconmanleader_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanleader_ca.png'}),
			b_iconmanmedic_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanmedic_ca.png'}),
			b_iconmanmg_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanmg_ca.png'}),
			b_iconmanofficer_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanofficer_ca.png'}),
			b_iconmanrecon_ca = new bisuniticon({iconUrl: 'icons/bisicons/b_iconmanrecon_ca.png'}),
			b_inf = new bisuniticon({iconUrl: 'icons/bisicons/b_inf.png'}),
			b_installation = new bisuniticon({iconUrl: 'icons/bisicons/b_installation.png'}),
			b_maint = new bisuniticon({iconUrl: 'icons/bisicons/b_maint.png'}),
			b_mech_inf = new bisuniticon({iconUrl: 'icons/bisicons/b_mech_inf.png'}),
			b_med = new bisuniticon({iconUrl: 'icons/bisicons/b_med.png'}),
			b_mortar = new bisuniticon({iconUrl: 'icons/bisicons/b_mortar.png'}),
			b_motor_inf = new bisuniticon({iconUrl: 'icons/bisicons/b_motor_inf.png'}),
			b_naval = new bisuniticon({iconUrl: 'icons/bisicons/b_naval.png'}),
			b_plane = new bisuniticon({iconUrl: 'icons/bisicons/b_plane.png'}),
			b_recon = new bisuniticon({iconUrl: 'icons/bisicons/b_recon.png'}),
			b_service = new bisuniticon({iconUrl: 'icons/bisicons/b_service.png'}),
			b_support = new bisuniticon({iconUrl: 'icons/bisicons/b_support.png'}),
			b_uav = new bisuniticon({iconUrl: 'icons/bisicons/b_uav.png'}),
			b_unknown = new bisuniticon({iconUrl: 'icons/bisicons/b_unknown.png'}),
			c_air = new bisuniticon({iconUrl: 'icons/bisicons/c_air.png'}),
			c_car = new bisuniticon({iconUrl: 'icons/bisicons/c_car.png'}),
			c_plane = new bisuniticon({iconUrl: 'icons/bisicons/c_plane.png'}),
			c_ship = new bisuniticon({iconUrl: 'icons/bisicons/c_ship.png'}),
			c_unknown = new bisuniticon({iconUrl: 'icons/bisicons/c_unknown.png'}),
		// red units
			o_air = new bisuniticon({iconUrl: 'icons/bisicons/o_air.png'}),
			o_armor = new bisuniticon({iconUrl: 'icons/bisicons/o_armor.png'}),
			o_art = new bisuniticon({iconUrl: 'icons/bisicons/o_art.png'}),
			o_hq = new bisuniticon({iconUrl: 'icons/bisicons/o_hq.png'}),
			o_iconman_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconman_ca.png'}),
			o_iconmanat_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanat_ca.png'}),
			o_iconmanengineer_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanengineer_ca.png'}),
			o_iconmanexplosive_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanexplosive_ca.png'}),
			o_iconmanleader_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanleader_ca.png'}),
			o_iconmanmedic_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanmedic_ca.png'}),
			o_iconmanmg_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanmg_ca.png'}),
			o_iconmanofficer_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanofficer_ca.png'}),
			o_iconmanrecon_ca = new bisuniticon({iconUrl: 'icons/bisicons/o_iconmanrecon_ca.png'}),
			o_inf = new bisuniticon({iconUrl: 'icons/bisicons/o_inf.png'}),
			o_installation = new bisuniticon({iconUrl: 'icons/bisicons/o_installation.png'}),
			o_maint = new bisuniticon({iconUrl: 'icons/bisicons/o_maint.png'}),
			o_mech_inf = new bisuniticon({iconUrl: 'icons/bisicons/o_mech_inf.png'}),
			o_med = new bisuniticon({iconUrl: 'icons/bisicons/o_med.png'}),
			o_mortar = new bisuniticon({iconUrl: 'icons/bisicons/o_mortar.png'}),
			o_motor_inf = new bisuniticon({iconUrl: 'icons/bisicons/o_motor_inf.png'}),
			o_naval = new bisuniticon({iconUrl: 'icons/bisicons/o_naval.png'}),
			o_plane = new bisuniticon({iconUrl: 'icons/bisicons/o_plane.png'}),
			o_recon = new bisuniticon({iconUrl: 'icons/bisicons/o_recon.png'}),
			o_service = new bisuniticon({iconUrl: 'icons/bisicons/o_service.png'}),
			o_support = new bisuniticon({iconUrl: 'icons/bisicons/o_support.png'}),
			o_uav = new bisuniticon({iconUrl: 'icons/bisicons/o_uav.png'}),
			o_unknown = new bisuniticon({iconUrl: 'icons/bisicons/o_unknown.png'})
		;
			// location icons
			
		var bislocicon = L.Icon.extend({
			options: {
				//iconSize: [48, 48],
				iconSize: [24, 24],
				//iconAnchor: [24, 24],
				iconAnchor: [12, 12]
				//labelAnchor: [10, -10],
			}
		});			
			
		var	boxblack_ca = new bislocicon({iconUrl: 'icons/bisicons/boxblack_ca.png'}),
			boxblue_ca = new bislocicon({iconUrl: 'icons/bisicons/boxblue_ca.png'}),
			boxgreen_ca = new bislocicon({iconUrl: 'icons/bisicons/boxgreen_ca.png'}),
			boxred_ca = new bislocicon({iconUrl: 'icons/bisicons/boxred_ca.png'}),
			busstop_ca = new bislocicon({iconUrl: 'icons/bisicons/busstop_ca.png'}),
			dotblack_ca = new bislocicon({iconUrl: 'icons/bisicons/dotblack_ca.png'}),
			dotblue_ca = new bislocicon({iconUrl: 'icons/bisicons/dotblue_ca.png'}),
			dotgreen_ca = new bislocicon({iconUrl: 'icons/bisicons/dotgreen_ca.png'}),
			dotred_ca = new bislocicon({iconUrl: 'icons/bisicons/dotred_ca.png'}),
			factory_ma = new bislocicon({iconUrl: 'icons/bisicons/factory_ma.png'}),
			fuelstation_ca = new bislocicon({iconUrl: 'icons/bisicons/fuelstation_ca.png'}),
			hospital_ca = new bislocicon({iconUrl: 'icons/bisicons/hospital_ca.png'}),
			iconplaneblack_ca = new bislocicon({iconUrl: 'icons/bisicons/iconplaneblack_ca.png'}),
			iconplanegreen_ca = new bislocicon({iconUrl: 'icons/bisicons/iconplanegreen_ca.png'}),
			lighthouse_ca = new bislocicon({iconUrl: 'icons/bisicons/lighthouse_ca.png'}),
			power_ca = new bislocicon({iconUrl: 'icons/bisicons/power_ca.png'}),
			powersolar_ca = new bislocicon({iconUrl: 'icons/bisicons/powersolar_ca.png'}),
			powerwave_ca = new bislocicon({iconUrl: 'icons/bisicons/powerwave_ca.png'}),
			powerwind_ca = new bislocicon({iconUrl: 'icons/bisicons/powerwind_ca.png'}),
			quay_ca = new bislocicon({iconUrl: 'icons/bisicons/quay_ca.png'}),
			tourism_ca = new bislocicon({iconUrl: 'icons/bisicons/tourism_ca.png'}),
			transmitter_ca = new bislocicon({iconUrl: 'icons/bisicons/transmitter_ca.png'}),
			viewpoint_ca = new bislocicon({iconUrl: 'icons/bisicons/viewpoint_ca.png'}),
			viewtower_ca = new bislocicon({iconUrl: 'icons/bisicons/viewtower_ca.png'}),
			watertower_ca = new bislocicon({iconUrl: 'icons/bisicons/watertower_ca.png'})
		;

		var bislocsmall = L.Icon.extend({
			options: {
				//iconSize: [48, 48],
				iconSize: [16, 16],
				//iconAnchor: [24, 24],
				iconAnchor: [8, 8]
				//labelAnchor: [10, -10],
			}
		});

		var bordercrossingblack_ca = new bislocsmall({iconUrl: 'icons/bisicons/bordercrossingblack_ca.png'}),
			bordercrossinggreen_ca = new bislocsmall({iconUrl: 'icons/bisicons/bordercrossinggreen_ca.png'}),
			bordercrossingred_ca = new bislocsmall({iconUrl: 'icons/bisicons/bordercrossingred_ca.png'}),
			church_ca = new bislocsmall({iconUrl: 'icons/bisicons/church_ca.png'}),
			chapel_ca = new bislocsmall({iconUrl: 'icons/bisicons/chapel_ca.png'}),
			hill_ca = new bislocsmall({iconUrl: 'icons/bisicons/hill_ca.png'}),
			rock_ca = new bislocsmall({iconUrl: 'icons/bisicons/rock_ca.png'}),
			ruin_ca = new bislocsmall({iconUrl: 'icons/bisicons/ruin_ca.png'}),
			triangleblack_ca = new bislocsmall({iconUrl: 'icons/bisicons/triangleblack_ca.png'}),
			triangleblue_ca = new bislocsmall({iconUrl: 'icons/bisicons/triangleblue_ca.png'}),
			trianglegreen_ca = new bislocsmall({iconUrl: 'icons/bisicons/trianglegreen_ca.png'}),
			trianglered_ca = new bislocsmall({iconUrl: 'icons/bisicons/trianglered_ca.png'})
		;
		
		var bislocbig = L.Icon.extend({
			options: {
				//iconSize: [48, 48],
				iconSize: [64, 64],
				//iconAnchor: [24, 24],
				iconAnchor: [32, 32]
				//labelAnchor: [10, -10],
			}
		});

		var xmark_black = new bislocbig({iconUrl: 'icons/bisicons/xmark_black.png'});
		
			// marker icons
			
		var bismarkicon = L.Icon.extend({
			options: {
				//iconSize: [48, 48],
				iconSize: [32, 32],
				//iconAnchor: [24, 24],
				iconAnchor: [16, 16]
				//labelAnchor: [10, -10],
			}
		});	
		
		var bunker_ca = new bismarkicon({iconUrl: 'icons/bisicons/bunker_ca.png'}),
			bunkergreen_ca = new bismarkicon({iconUrl: 'icons/bisicons/bunkergreen_ca.png'}),
			end_ca = new bismarkicon({iconUrl: 'icons/bisicons/end_ca.png'}),
			marker_ca = new bismarkicon({iconUrl: 'icons/bisicons/end_ca.png'}),
			objective_ca = new bismarkicon({iconUrl: 'icons/bisicons/objective_ca.png'}),
			pickup_ca = new bismarkicon({iconUrl: 'icons/bisicons/pickup_ca.png'}),
			respawn_unknown_ca = new bismarkicon({iconUrl: 'icons/bisicons/respawn_unknown_ca.png'}),
			start_ca = new bismarkicon({iconUrl: 'icons/bisicons/start_ca.png'}),
			taskicon_ca = new bismarkicon({iconUrl: 'icons/bisicons/taskicon_ca.png'}),
			taskiconcancelled_ca = new bismarkicon({iconUrl: 'icons/bisicons/taskiconcancelled_ca.png'}),
			taskiconcreated_ca = new bismarkicon({iconUrl: 'icons/bisicons/taskiconcreated_ca.png'}),
			taskicondone_ca = new bismarkicon({iconUrl: 'icons/bisicons/taskicondone_ca.png'}),
			taskiconfailed_ca = new bismarkicon({iconUrl: 'icons/bisicons/taskiconfailed_ca.png'}),
			warning_ca = new bismarkicon({iconUrl: 'icons/bisicons/warning_ca.png'}),
			waypoint_ca = new bismarkicon({iconUrl: 'icons/bisicons/waypoint_ca.png'}),
			waypointcompleted_ca = new bismarkicon({iconUrl: 'icons/bisicons/waypointcompleted_ca.png'}),
			waypointeditor_ca = new bismarkicon({iconUrl: 'icons/bisicons/waypointeditor_ca.png'})
		;
		

		// cities & towns ****

		var cities = new L.layerGroup();

		
		// marine

		var marine = new L.layerGroup();
		

		// airfield

		var airfield = new L.layerGroup();
        loadAirfields(airfield, map);

		// military

		var military = new L.layerGroup();
        loadMilitary(military, map);

		// infrastructure
		var infrastructure = new L.layerGroup();
        loadInfrastructure(infrastructure, map);


		// peaks

		var peaks = new L.layerGroup();
        loadPeaks(peaks, map);

		// landmarks
		var landmarks = new L.layerGroup();


		// religious manual

		var religious = new L.layerGroup();
        loadReligiousMarkers(religious, map);


		// overlays

		var baseLayer = {
			"Map": map
		};
		
		var overlayMaps = {
			"Contacts": contactReportsLayer,
			"Cities & Towns": cities,
			"Marine": marine,
			"Airfields": airfield,
			"Military Bases": military,
			"Infrastructure": infrastructure,
			"Peaks": peaks,
			"Landmarks": landmarks,
			"Religious": religious
			
		};
		
		// control
		
		L.control.layers(baseLayer, overlayMaps).addTo(map);
		
		// Turn on some of the layers by default
		map.addLayer(cities);
		map.addLayer(military);
		map.addLayer(airfield);
		map.addLayer(peaks);
		
	
  

		function getParameterByName(name) {
			name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
			var regex = new RegExp("[\\?&]" + name + "=([^&#]*)");
			results = regex.exec(location.search);
			return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
		}
		
		function getHashByName(name) {
			name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
			var regex = new RegExp("[\\#&]" + name + "=([^&#]*)");
			results = regex.exec(location.hash);
			return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
		}
		
		function loadContactReports() {
			var oReq= new XMLHttpRequest();
			oReq.open("GET", "missions/"+ missionName+ "/contacts.json", true);
			oReq.onreadystatechange= function() {
				if (oReq.readyState!= 4) { return; }

				var contacts= JSON.parse(oReq.responseText);
				
				// clear the layer if it has content already - shouldn't have.
				contactReportsLayer.clearLayers();
				
				// for each report....
				contacts.contacts.forEach(function(contactReport) {
					L.marker(map.unproject([contactReport.xpos, mapYMax- contactReport.ypos], map.getMaxZoom()), {icon: warning_ca}).addTo(contactReportsLayer)
					  .bindLabel(contactReport.group+ " "+ contactReport.startTime)
					  .bindPopup("<em>"+ contactReport.group+ " "+ contactReport.startTime+ "</em><br />Shots Fired: "+ contactReport.shots+ "<br />Duration: "+ contactReport.Duration+ "<br />Casualties: "+ contactReport.cas+"<br /><br />"+ 

					  "<a onclick='javascript:loadAARSequence("+ (contactReport.indexPos- 1)+ ");loadAARSequence("+contactReport.indexPos+");'>jump to</a>...");
					
					

					
//.bindLabel(unitPos.name).bindPopup("<em>"+ unitPos.name+ "</em><br />Group: "+ unitPos.grp+ "<br />Shots: "+ unitPos.shots+ "<br />Hits: "+ unitPos.hits+ "<br />Damage: "+ unitPos.dam+ "<br /><br />In Vehicle: "+ unitPos.inveh).addTo(currentUnitsLayer);					
					
				});
				contactReportsLayer.addTo(map);
			
				
			};
			// oReq.send(null);
		}
		
		function getVectorTo(ArmaX, ArmaY, Angle, Distance) {
			var newX= Math.sin(Angle* (Math.PI/180))* Distance;
			var newY= Math.cos(Angle* (Math.PI/180))* Distance* -1;
			return [newX+ ArmaX, newY+ ArmaY];		
		}
		
		// Highlight a supplied marker name in the map...
		function highlightMarker(markerName) {
			// So we can keep track as it plays.
			if (highlightedUnit== markerName) {
			  highlightedUnit= "";
			} else {
			  highlightedUnit= markerName;
			 }
			  
			// Now look for that title..
			currentUnitsLayer.eachLayer(function (layer) {
				if (layer.options.title== markerName) {
					layer.togglePopup();
				}
			});  // End of eachLayer...
		}
		
		function loadAARSequence(indexPosition) {
			var oReq= new XMLHttpRequest();
			oReq.open("GET", "missions/"+ missionName+ "/"+ indexPosition+ ".json", true);
			oReq.onreadystatechange= function() {
				if (oReq.readyState!= 4) { return; }
				// debugger;
				var unitPositions= JSON.parse(oReq.responseText);
				// Clear existing layer.
				currentUnitsLayer.clearLayers();
				// Stats for this tick..
				var stats= {"w_hits":0,"w_shots":0, "e_hits":0, "e_shots":0};
								
				// This will contain our current positions for west units..to show a tail later.
				var currUnitPos= new Object();
				sidebar.setContent('<h1>West Units</h1>');
				unitPositions.positions.forEach(function(unitPos) {
					if (unitPos.isDead)
					{
						L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: dotblack_ca}).addTo(currentUnitsLayer);
					} else if (unitPos.side=="EAST")
					{
						// is it a vehicle?
						if (unitPos.hasOwnProperty('vehicle'))
						{
							L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: eval('o_'+ unitPos.vehicle)}).addTo(currentUnitsLayer);
						} else
						{
							var curMarker= L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: dotred_ca}).addTo(currentUnitsLayer);
							curMarker.setOpacity(0.5);
							if (unitPos.hits> 0 || unitPos.shots> 0)
							{
								curMarker.setOpacity(1);
							}
							stats.e_shots= stats.e_shots+ unitPos.shots;
							stats.e_hits= stats.e_hits+ unitPos.hits;
							// Did it fire?
							if (unitPos.shots> 0)
							{
								L.polyline([map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()),
								  map.unproject(getVectorTo(unitPos.x, mapYMax- unitPos.y, unitPos.fdir, 20), map.getMaxZoom())], {color: 'red', weight:2}).addTo(currentUnitsLayer);
							}

						}
					} else if (unitPos.side=="CIV")
					{
						if (unitPos.hasOwnProperty('vehicle'))
						{
							// TODO need proper civ/empty markers for vehicles....and work out dead units with extra vehicles attached???
							//var curMarker= L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: boxblack_ca}).addTo(currentUnitsLayer);
							//curMarker.setOpacity(0.4);
							//curMarker.bindLabel(unitPos.vehicle);
						} else
						{
							L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: dotgreen_ca}).addTo(currentUnitsLayer);
						}
					} else if (unitPos.side=="WEST")
					{
						// is it a vehicle?
						if (unitPos.hasOwnProperty('vehicle'))
						{
							L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: eval('b_'+ unitPos.vehicle)}).addTo(currentUnitsLayer);
						} else
						{
							
							var curMarker= L.marker(map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()), {icon: dotblue_ca, title:unitPos.name}).bindLabel(unitPos.name).bindPopup("<em>"+ unitPos.name+ "</em><br />Group: "+ unitPos.grp+ "<br />Shots: "+ unitPos.shots+ "<br />Wounds: "+ unitPos.hits+ "<br />Damage: "+ unitPos.dam+ "<br /><br />In Vehicle: "+ unitPos.inveh).addTo(currentUnitsLayer);
							
							curMarker.setOpacity(0.5);
							if (unitPos.hits> 0 || unitPos.shots> 0)
							{
								curMarker.setOpacity(1);
							}
							currUnitPos[unitPos.name]= [unitPos.x, mapYMax- unitPos.y];
							stats.w_shots= stats.w_shots+ unitPos.shots;
							stats.w_hits= stats.w_hits+ unitPos.hits;
							// Did it fire?
							if (unitPos.shots> 0)
							{
								L.polyline([map.unproject([unitPos.x, mapYMax- unitPos.y], map.getMaxZoom()),
								  map.unproject(getVectorTo(unitPos.x, mapYMax- unitPos.y, unitPos.fdir, 20), map.getMaxZoom())], {color: 'red', weight:2}).addTo(currentUnitsLayer);
							}
							// Is there a prior Pos for this unit?  If so, draw a tail..
							if (priorUnitPos.hasOwnProperty(unitPos.name))
							{
								L.polyline([map.unproject(priorUnitPos[unitPos.name], map.getMaxZoom()),map.unproject(currUnitPos[unitPos.name], map.getMaxZoom())], {color: 'blue', weight:3, opacity:0.2}).addTo(currentUnitsLayer);
							}
							// Are we tracking this unit?
							if (highlightedUnit== unitPos.name)
							{
								curMarker.openPopup();														
							}
							
							document.getElementById('sidebar').innerHTML= document.getElementById('sidebar').innerHTML+ '<a onclick=\'javascript:highlightMarker("'+ unitPos.name+'");\'>'+ unitPos.name+ '</a> ('+ unitPos.grp+ ') '+ (1- unitPos.dam)* 100+ '%<br />';
							
							
						}
					}
					
				
				});
				
				// Replace the old unit positions with this one...for the next plotting.
				priorUnitPos= currUnitPos;
				
				document.getElementById("currentPos").innerText="Position "+ indexPosition+ ", East Hits/Shots: "+ stats.e_hits+ "/"+ stats.e_shots+ ", West Hits/Shots: "+ stats.w_hits+ "/"+ stats.w_shots;
				document.location.hash="zoom="+ map.getZoom()+ "&lat="+ map.getCenter().lat+ "&lng="+ map.getCenter().lng+ "&position="+ indexPosition;
				
			
			};
			oReq.send(null);
			
		
		}
		
		// auto foward through stuff.
		function setupPlay() {
				//debugger;
				// Cheat to stop double clicking....  :)
				clearInterval(intervalTimer);	
				intervalTimer= setInterval(function(){currentIndex++;loadAARSequence(currentIndex)}, 1000);
		}
		
		function setupPause() {
			clearInterval(intervalTimer);
		}

		function setupReset() {
			currentIndex= 0;
			loadAARSequence(currentIndex);
		}

		$(document).ready(function() {
            // What mission?
            if ('' !== getParameterByName('mission'))
            {
                missionName= getParameterByName('mission');
            } else
            {
                missionName= '';
                window.alert('No mission specified.');
            }

		  //is there a marker in the URL?
		  
		  if ('' !== getParameterByName('markerID'))
		  {
			  map.panTo(markers[getParameterByName('markerID')].openPopup().getLatLng());
			  // ignore the zoom etc...
			  map.setZoom(map.getMaxZoom()- 1);
		  } else 
		  {
			  // Set the position stuff.
			  if ('' !== getHashByName('zoom'))
			  {
				// presume that if there's zoom, there's long/lat tooo...  BAD
				map.setView([getHashByName('lat'), getHashByName('lng')], getHashByName('zoom'));
			  }
		  }
		  
		  // Show the first position.
		  if ('' !== getHashByName('position'))
		  {
		  	currentIndex= getHashByName('position');

		  }
		  loadAARSequence(currentIndex);
		  currentUnitsLayer.addTo(map);
		 
	      // Show the contact Reports.
		  loadContactReports();
		  
		
		});
		
		// Want to update our URL with coords/zoom as we move around.
		map.on('zoomend', function(e) {
			document.location.hash="zoom="+ map.getZoom()+ "&lat="+ map.getCenter().lat+ "&lng="+ map.getCenter().lng+ "&position="+ currentIndex;
		});
		map.on('moveend', function(e) {
			document.location.hash="zoom="+ map.getZoom()+ "&lat="+ map.getCenter().lat+ "&lng="+ map.getCenter().lng+ "&position="+ currentIndex;
		});
		map.on('mousemove', function(e) {
		  // Show map coordinates in status bar.
		  var cursorPos= map.project(e.latlng, map.getMaxZoom());
		  document.getElementById('coords').innerText= 'ArmA Coordinates: '+ cursorPos.x+ ', '+ (mapYMax- cursorPos.y);
		
		});
		
		
    </script>
	
	
	
</body>
</html>
